<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="<%= BASE_URL %>favicon.ico">
    <title><%= htmlWebpackPlugin.options.title %></title>
  </head>
  <body>
    <noscript>
      <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
    </noscript>
    <!-- <div id="app"></div> -->
    <!-- built files will be auto injected -->
  </body>
  <!-- 微信扫码登录 -->
  <!-- <script src="https://res.wx.qq.com/connect/zh_CN/htmledition/js/wxLogin.js"></script> -->
  <script>
    // if (!Number.prototype._toFixed) {
    //   Number.prototype._toFixed = Number.prototype.toFixed;
    // }
    // Number.prototype.toFixed = function(n) {
    //   return (this + 1e-14)._toFixed(n);
    // };
    let data  = {price:5,quantity:2}
    let target = null
    class Dep {
      constructor () {
        this.subscribers = []
      }

      depend(){
        if (target && !this.subscribers.includes(target)) {
          this.subscribers.push(target)
        }
      }

      notify(){
        this.subscribers.forEach(sub=>sub())
      }
    }
    Object.keys(data).forEach(key=>{
      let interValue = data[key]
      const dep = new Dep()
      Object.defineProperty(data,key,{
        get(){
          dep.depend()
          return interValue
        },
        set(newVal){
          interValue = newVal
          dep.notify()
        }
      })
    })

    function watcher(myFunc) {
      target = myFunc
      target()
      target = null
    }
    watcher(()=>{
      data.total = data.price * data.quantity
    })
    // setInterval(()=>{
    //   data.price = data.price+5
    //   // console.log(data.total,'==========');
    // },3000)
  </script>
</html>
